<div id="topic_list">
  <%- partial('../topic/abstract', {collection:topics, as:'topic'}) %>
</div>
<div class='pagination' current_page='<%= current_page %>'>
  <ul>
    <% var base_url = base + (base.indexOf('?') < 0 ? '?' : '&')
      + 'tab=' + (typeof tab !== 'undefined' ? tab : '') + '&page='; %>
    <% if (current_page == 1) { %>
    <li class='disabled'><a>«</a></li>
    <% } else { %>
    <li><a href="<%= base_url %>1">«</a></li>
    <% } %>

    <%
    var page_start = current_page - 2 > 0 ? current_page - 2 : 1;
    var page_end = page_start + 4 >= pages ? pages : page_start + 4;
    %>

    <% if (page_start > 1) { %>
    <li><a>...</a></li>
    <% } %>

    <% for(var i = page_start; i <= page_end; i++) { %>
    <% if (i === current_page) { %>
    <li class='disabled'><a><%= i %></a></li>
    <% } else { %>
    <li><a href='<%= base_url + i %>'><%= i %></a></li>
    <% } %>
    <% } %>

    <% if (page_end < pages ) { %>
    <li><a>...</a></li>
    <% } %>

    <% if (current_page == pages) { %>
    <li class='disabled'><a>»</a></li>
    <% } else { %>
    <li><a href='<%= base_url + pages %>'>»</a></li>
    <% } %>
  </ul>
</div>
<script>
  $(document).ready(function () {
    var $nav = $('.pagination');
    var current_page = $nav.attr('current_page');
    if (current_page) {
      $nav.find('li').each(function () {
        var $li = $(this);
        var $a = $li.find('a');
        if ($a.html() == current_page) {
          $li.addClass('active');
          $a.removeAttr('href');
        }
      });
    }
  });
</script>
